<template>
	<view>
		<view class="d-flex flex-row justify-content-between">
			<view class="d-flex flex-row align-items-center">
				<image class="min-order-img" src="../../static/tarbar-logo/order-selected.png"></image>
				<view class="font-color-999 font-size-24 m-l-20">{{order.created_at||'-'}} </view>
			</view>
			<view class="font-color-999 font-size-24">{{order.state_name||'-'}}</view>
		</view>
		<view class="divider-line"></view>
		<view class="d-flex flex-column">
			<view class="p-b-10">伊香牛肉面-福州大道</view>
			<view class="font-color-333 font-size-28 p-b-10" @click="toOrderView(order.id)">
				{{order.product_name||'-'}}
			</view>
		</view>
		<view class="d-flex flex-row justify-content-between">
			<view class="font-color-999 font-size-28">共计{{order.quantity||0}}商品</view>
			<view class="font-size-28">总计：￥{{order.total_price||'00.00'}}</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'component-order-item',
		props:{
			order: {
				type:Object
			}
		},
		methods:{
			toOrderView(id){
				uni.navigateTo({
					url:`../../pages/order/view?id=${id}`
				})
			}
		}
	}
</script>

<style>
	/* @import '@/assets/css/order.scss' */
	.min-order-img {
		width: 30rpx;
		height: 30rpx;
	}
	.divider-line{
		width: 100%;
		height: 2rpx;
		margin: 20rpx 0;
		background-color: #eee;
	}
</style>
